<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>订单确认</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/main.css" />
<!--[if lt IE 9]>
<script src="../js/html5.js "></script >
<script src="../js/respond.min.js "></script >
<![endif]-->
<script src="../js/jquery.js"> </script>
<script src="../js/base.js"></script>
<script src="../js/common.js"></script>
</head>

<body>
<section class="tourlist main">
	<header class="white">
    	<span><</span>确认订单
    </header>
    <h3>当下订单</h3>
    <ul>
    	<li>
            05月20日19:00
        	<span class="textright on">进行中</span>
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        	<img class="tip tipright tabsection" data-tab="on" src="../images/arrowtipright.png">
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        </li>
    </ul>
    <h3>未完成订单</h3>
    <ul>
    	<li>
            05月20日19:00
        	<span class="textright no">未完成</span>
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        	<img class="tip tipright tabsection" data-tab="no" src="../images/arrowtipright.png">
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        </li>
    </ul>
    <h3>已完成订单</h3>
    <ul>
    	<li>
            05月20日19:00
        	<span class="textright">已完成</span>
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        	<img class="tip tipright" src="../images/arrowtipright.png">
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        </li>
    </ul>
    <ul>
    	<li>
            05月20日19:00
        	<span class="textright">已完成</span>
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        	<img class="tip tipright" src="../images/arrowtipright.png">
        </li>
    	<li>
        	<img class="tip tipleft" src="../images/personblack.png">
            山西
        </li>
    </ul>
</section> 
  
  
  
  

<section class="tourlist no">
	<header class="white">
    	<span class="tabsection" data-tab="main"><</span>未完成订单
    </header>
    <ul class="list">
        <li class="person">
            <img src="../images/personblack.png">
            <p>18128128182</p>
            <p><span>男</span><span>男</span><span>男</span></p>
            <span class="phone">电话</span>
        </li>
        <li class="tour">
        	<p>05月20日19:00</p>
            <p><img src="../images/personblack.png">山西</p>
            <p><img src="../images/personblack.png">山西</p>
        </li>
        <li class="price">140</li>
    </ul>
    
    <div class="btnbox">
		<a href="javascript:void(0);" class="originb">确认送达</a>
		<a class="tabsection" data-tab="no1" href="javascript:void(0);" class="grayb">取消订单</a>
		<a href="javascript:void(0);" class="sgrayb">投诉</a>
    </div>
</section> 

<section class="tourlist no1">
	<header class="white">
    	<span class="tabsection" data-tab="main"><</span>未完成订单
    </header>
    <ul class="list">
        <li class="person">
            <img src="../images/personblack.png">
            <p>18128128182</p>
            <p><span>男</span><span>男</span><span>男</span></p>
            <span class="phone">电话</span>
        </li>
        <li class="tour">
        	<p>05月20日19:00</p>
            <p><img src="../images/personblack.png">山西</p>
            <p><img src="../images/personblack.png">山西</p>
        </li>
        <li class="price">140</li>
    </ul>
    
    <div class="btnbox">
		<h4>订单已取消</h4>
		<a href="javascript:void(0);" class="grayb grayb2">投诉</a>
		<a href="javascript:void(0);" class="grayb grayb2">评论</a>
    </div>
</section>  




<section class="tourlist on">
	<header class="white">
    	<span class="tabsection" data-tab="main"><</span>订单进行中
    </header>
    <ul class="list">
        <li class="person">
            <img src="../images/personblack.png">
            <p>18128128182</p>
            <p><span>男</span><span>男</span><span>男</span></p>
            <span class="phone">电话</span>
        </li>
        <li class="tour">
        	<p>05月20日19:00</p>
            <p><img src="../images/personblack.png">山西</p>
            <p><img src="../images/personblack.png">山西</p>
        </li>
        <li class="price">140</li>
    </ul>
    
    <div class="btnbox">
		<a href="javascript:void(0);">确认送达</a>
		<a href="javascript:void(0);" class="sgrayb">投诉</a>
    </div>
</section>    
<script>
	$(".switch").click(function(){
		$(this).toggleClass("on");
	})
	
	
</script>


</body>
</html>
